<template>
    <div class="bg-container">
        <div class="my-header">
            <div style="height: 24px;width: 100%;border-bottom: 1px solid #e5e7eb; margin-bottom: 15px;"></div>

            <div class="search-form" v-if="headerShow">
                <a-form :model="form">
                    <a-row :gutter="16">
                        <a-col :span="5">
                            <a-form-item field="value1" label="下单日期：" label-col-flex="100px" style="">
                                <a-input v-model="fromList.endTime" placeholder="please enter..." />
                            </a-form-item>
                        </a-col>
                        <a-col :span="5">
                            <a-form-item field="value2" label="色号：" label-col-flex="80px">
                                <a-input v-model="fromList.ColorId" placeholder="please enter..." />
                            </a-form-item>
                        </a-col>
                        <a-col :span="5">
                            <a-form-item field="value3" label="色称：" label-col-flex="80px">
                                <a-input v-model="fromList.ColorName" placeholder="please enter..." />
                            </a-form-item>
                        </a-col>
                        <a-col :span="5">
                            <a-form-item field="value3" label="客户名称：" label-col-flex="80px">
                                <a-select popup-container="html"  :style="{ width: '320px' }" v-model="fromList.customName"
                                    placeholder="Please select ..." allow-clear>
                                    <a-option v-for="item of basicData.custom" :value="item.id" :key="item.id"
                                        :label="item.customName" />
                                </a-select>
                            </a-form-item>
                        </a-col>
                    </a-row>

                    <a-row :gutter="16">
                        <a-col :span="5">
                            <a-form-item field="value1" label="染整单号：" label-col-flex="100px">
                                <a-select popup-container="html"  :style="{ width: '320px' }" v-model="fromList.clientDyeCode"
                                    placeholder="Please select ..." allow-clear>

                                </a-select>
                            </a-form-item>
                        </a-col>
                        <a-col :span="5">
                            <a-form-item field="value2" label="跟单号：" label-col-flex="80px">
                                <a-select popup-container="html"  :style="{ width: '320px' }" v-model="fromList.genDanCode"
                                    placeholder="Please select ..." allow-clear>

                                </a-select>

                            </a-form-item>
                        </a-col>
                        <a-col :span="5">
                            <a-form-item field="value3" label="订单类型：" label-col-flex="80px">
                                <a-select popup-container="html"  :style="{ width: '320px' }" v-model="fromList.dyType"
                                    placeholder="Please select ..." allow-clear>
                                    <a-option v-for="item of basicData.orderNature" :value="item.id" :key="item.id"
                                        :label="item.detailName" />
                                </a-select>
                            </a-form-item>
                        </a-col>
                        <a-col :span="5">
                            <a-form-item field="value3" label="业务员：" label-col-flex="80px">
                                <a-select popup-container="html"  :style="{ width: '320px' }" v-model="fromList.account"
                                    placeholder="Please select ..." allow-clear>
                                    <a-option v-for="item of basicData.hrEmployee" :value="item.id" :key="item.id"
                                        :label="item.text" />
                                </a-select>
                            </a-form-item>
                        </a-col>
                    </a-row>

                </a-form>
            </div>
            <div class="my-divisders">
                <a-divider orientation="center">
                    <icon-double-up v-if="headerShow" @click="headerShow = false" :strokeWidth="2" :size="18" />
                    <icon-double-down v-else @click="headerShow = true" :strokeWidth="2" :size="18" />
                </a-divider>
            </div>
        </div>
    </div>

    <div class="gang"></div>

    <div ref="tablediv" style="padding: 10px; box-sizing: border-box;height:80%; background-color: #fff;">
        <a-tabs   :lazy-load="true" :justify="true">
            <a-tab-pane key="1" title="待处理">
                <div class="my-tool-bar">
                    <div class="bg-container-1">
                        <el-button type="primary" :icon="Search" class="stbutencx" @click="selectHandler">查询</el-button>
                        <el-button type="success" :icon="CirclePlus" class="stbutenxz" @click="addHandler">新增</el-button>
                        <el-button plain :icon="Delete" @click="deleteHandler">删除</el-button>
                    </div>
                </div>
                <div style="height:15px;"></div>


                <AgGridVuesCopys style="height:72vh;" class="ag-theme-alpine" :columnDefs="tc" :rowData="tableCon.tableConter"
                    :defaultColDef="defaultColDef" rowSelection="multiple" @grid-ready="gridReady">
                </AgGridVuesCopys>

            </a-tab-pane>

            <a-tab-pane key="2" title="已处理">
                <div class="my-tool-bar">
                    <a-button type="primary">余量生产流转卡</a-button>
                </div>
                <div style="height:15px;"></div>
                <AgGridVuesCopys style="height:56vh;" class="ag-theme-alpine" :columnDefs="ta" :rowData="tableCon.tableConter"
                    :defaultColDef="defaultColDef" rowSelection="multiple" @grid-ready="gridReady">
                </AgGridVuesCopys>
            </a-tab-pane>
        </a-tabs>


    </div>

    <a-drawer :drawer-style="{ 'zIndex': 9999 }" placement="bottom" :mask-closable="false" width="100" height="100%"
        :visible="pageData.showAdd" unmountOnClose @ok="sideOk" @cancel="pageData.showAdd = false" cancel-text='关闭'
        ok-text='保存'>
        <template #title>
            <div style="position: absolute; right: 50px;">
                <a-space>
                    <a-button type="outline">成品面料信息维护</a-button>
                    <a-button type="outline" @click="exCustomer">导入台巨客户</a-button>
                </a-space>
            </div>
            {{ pageData.sideTitle }}
        </template>
        <div>
            <a-form :model="form">
                <a-row :gutter="16">
                    <a-col :span="4">
                        <a-form-item field="orderCode" label="订单号:" label-col-flex="100px">
                            <a-input v-model="form.orderCode" readonly />
                        </a-form-item>
                    </a-col>
                    <a-col :span="4">
                        <a-form-item field="authorizedStrengthTime" label="编制日期:" label-col-flex="100px">
                            <!-- <a-select popup-container="html"  :style="{ width: '320px' }" v-model="form.authorizedStrengthTime" allow-clear>
                            </a-select> -->
                            <a-date-picker  popup-container="html"  v-model="form.authorizedStrengthTime" style="width: 200px;" />
                        </a-form-item>
                    </a-col>
                    <a-col :span="4">
                        <a-form-item field="productionMode" label="生产方式:" label-col-flex="100px">
                            <a-select popup-container="html"  :style="{ width: '320px' }" v-model="form.productionMode">
                                <a-option v-for="item of basicData.ProductionMode" :value="item.id" :key="item.id"
                                    :label="item.productionMode" />
                            </a-select>
                        </a-form-item>
                    </a-col>
                    <a-col :span="4">
                        <a-form-item field="customName" label="客户名称:" label-col-flex="100px">
                            <a-select popup-container="html"  :style="{ width: '320px' }" v-model="form.customName">
                                <a-option v-for="item of basicData.custom" :value="item.id" :key="item.id"
                                    :label="item.customName" />
                            </a-select>
                        </a-form-item>
                    </a-col>
                    <a-col :span="4">
                        <a-form-item field="constitute" label="小缸费构成:" label-col-flex="100px">
                            <a-input v-model="form.constitute" />
                        </a-form-item>
                    </a-col>
                    <a-col :span="4">
                        <a-form-item field="lastDeliveryTime" label="最终交货日期:" label-col-flex="100px">
                            <a-date-picker  popup-container="html"  style="width: 320px;" />
                        </a-form-item>
                    </a-col>
                </a-row>

                <a-row :gutter="16">
                    <a-col :span="4">
                        <a-form-item field="customOrderCode" label="客户订单号:" label-col-flex="100px">
                            <a-input v-model="form.customOrderCode" />
                        </a-form-item>
                    </a-col>
                    <a-col :span="4">
                        <a-form-item field="workshop" label="生产车间:" label-col-flex="100px">
                            <a-select popup-container="html"  :style="{ width: '320px' }" v-model="form.workshop" allow-clear>
                            </a-select>
                        </a-form-item>
                    </a-col>
                    <a-col :span="4">
                        <a-form-item field="salesDepartment" label="业务部:" label-col-flex="100px">
                            <a-select popup-container="html"  :style="{ width: '320px' }" v-model="form.salesDepartment" allow-clear>
                            </a-select>
                        </a-form-item>
                    </a-col>
                    <a-col :span="4">
                        <a-form-item field="customOrderName" label="客户名称:" label-col-flex="100px">
                            <a-input v-model="form.customOrderName" />
                        </a-form-item>
                    </a-col>
                    <a-col :span="4">
                        <a-form-item field="hqDeliveryTime" label="总部交货日期:" label-col-flex="100px">
                            <a-date-picker  popup-container="html"  style="width: 320px;" />
                        </a-form-item>
                    </a-col>
                    <a-col :span="4">
                        <a-form-item field="require" label="客户要求:" label-col-flex="100px">
                            <a-input v-model="form.require" />
                        </a-form-item>
                    </a-col>
                </a-row>

                <a-row :gutter="16">
                    <a-col :span="4">
                        <a-form-item field="customPoCode" label="客户PO号:" label-col-flex="100px">
                            <a-input v-model="form.customPoCode" />
                        </a-form-item>
                    </a-col>
                    <a-col :span="4">
                        <a-form-item field="testCriterion" label="测试标准:" label-col-flex="100px">
                            <a-select popup-container="html"  :style="{ width: '320px' }" v-model="form.testCriterion" allow-clear>
                                <a-option v-for="item of basicData.VerifyStandard" :value="item.id" :key="item.id"
                                    :label="item.verifyStandard" />
                            </a-select>
                        </a-form-item>
                    </a-col>
                    <a-col :span="4">
                        <a-form-item field="machinType" label="加工类型:" label-col-flex="100px">
                            <a-select popup-container="html"  :style="{ width: '320px' }" v-model="form.machinType" allow-clear>
                                <a-option v-for="item of basicData.machinType" :value="item.id" :key="item.id"
                                    :label="item.machinType" />
                            </a-select>
                        </a-form-item>
                    </a-col>
                    <a-col :span="4">
                        <a-form-item field="clientDocumentary" label="客户跟单:" label-col-flex="100px">
                            <a-input v-model="form.clientDocumentary" />
                        </a-form-item>
                    </a-col>
                    <a-col :span="4">
                        <a-form-item field="marketingDeliveryTime" label="营销交货日期:" label-col-flex="100px">
                            <a-date-picker  popup-container="html"  style="width: 320px;" />
                        </a-form-item>
                    </a-col>
                    <a-col :span="4">
                        <a-form-item field="marketType" label="面料销售类型:" label-col-flex="100px">
                            <a-select popup-container="html"  :style="{ width: '320px' }" v-model="form.testCriterion" allow-clear>
                                <a-option v-for="item of basicData.plusMaterial" :value="item.id" :key="item.id"
                                    :label="item.plusMaterial" />
                            </a-select>
                        </a-form-item>
                    </a-col>
                </a-row>

                <a-row :gutter="16">
                    <a-col :span="4">
                        <a-form-item field="clientDyeCode" label="客户染整单号:" label-col-flex="100px">
                            <a-input v-model="form.clientDyeCode" />
                        </a-form-item>
                    </a-col>
                    <a-col :span="4">
                        <a-form-item field="coloringIlluminant" label="对色光源:" label-col-flex="100px">
                            <a-select popup-container="html"  :style="{ width: '320px' }" v-model="form.orderNature" allow-clear>
                                <a-option v-for="item, index of basicData.coloringMatch" :value="index" :key="index"
                                    :label="item.colourLight" />
                            </a-select>
                        </a-form-item>
                    </a-col>
                    <a-col :span="4">
                        <a-form-item field="orderNature" label="订单性质:" label-col-flex="100px">
                            <a-select popup-container="html"  :style="{ width: '320px' }" v-model="form.orderNature" allow-clear>
                                <a-option v-for="item of basicData.orderNature" :value="item.id" :key="item.id"
                                    :label="item.detailName" />
                            </a-select>
                        </a-form-item>
                    </a-col>
                    <a-col :span="4">
                        <a-form-item field="placeDepartment" label="下单部门:" label-col-flex="100px">
                            <a-select popup-container="html"  :style="{ width: '320px' }" v-model="form.placeDepartment" allow-clear>
                            </a-select>
                        </a-form-item>
                    </a-col>
                    <a-col :span="4">
                        <a-form-item field="initialDeliveryTime" label="最终交货日期:" label-col-flex="100px">
                            <a-date-picker  popup-container="html"  style="width: 320px;" />
                        </a-form-item>
                    </a-col>
                    <a-col :span="4">
                        <a-form-item field="circulatCardType" label="流转卡归类:" label-col-flex="100px">
                            <a-select popup-container="html"  :style="{ width: '320px' }" v-model="form.circulatCardType" allow-clear>
                                <a-option v-for="item of basicData.ExchangecalorieClassify" :value="item.id" :key="item.id"
                                    :label="item.encodings" />
                            </a-select>
                        </a-form-item>
                    </a-col>
                </a-row>

                <a-row :gutter="16">
                    <a-col :span="4">
                        <a-form-item field="clientPlanOrderCode" label="客户计划单号:" label-col-flex="100px">
                            <a-input v-model="form.clientPlanOrderCode" />
                        </a-form-item>
                    </a-col>
                    <a-col :span="4">
                        <a-form-item field="handDatum" label="手感资料:" label-col-flex="100px">
                            <a-input v-model="form.handDatum" />
                        </a-form-item>
                    </a-col>
                    <a-col :span="4">
                        <a-form-item field="settlementFirm" label="结算公司:" label-col-flex="100px">
                            <a-input v-model="form.settlementFirm" />
                        </a-form-item>
                    </a-col>
                    <a-col :span="4">
                        <a-form-item field="ultimatelyBuyer" label="最终买家:" label-col-flex="100px">
                            <a-select popup-container="html"  :style="{ width: '320px' }" v-model="form.ultimatelyBuyer" allow-clear>
                            </a-select>
                        </a-form-item>
                    </a-col>
                    <a-col :span="4">
                        <a-form-item field="urgentCategory" label="加急类型:" label-col-flex="100px">
                            <a-select popup-container="html"  :style="{ width: '320px' }" v-model="form.urgentCategory" allow-clear>
                                <a-option v-for="item of basicData.UrgentCategory" :value="item.id" :key="item.id"
                                    :label="item.urgentCategory" />
                            </a-select>
                        </a-form-item>
                    </a-col>
                    <a-col :span="4">
                        <a-form-item field="remark" label="备注:" label-col-flex="100px">
                            <a-input v-model="form.remark" />
                        </a-form-item>
                    </a-col>
                </a-row>


                <a-row :gutter="16">
                    <a-col :span="4">
                        <a-form-item field="clientBillsType" label="客户单据类型:" label-col-flex="100px">
                            <a-input v-model="form.clientBillsType" />
                        </a-form-item>
                    </a-col>
                    <a-col :span="4">
                        <a-form-item field="labelFormatCode" label="标签格式:" label-col-flex="100px">
                            <a-select popup-container="html"  :style="{ width: '320px' }" v-model="form.labelFormatCode" allow-clear>
                                <a-option v-for="item of basicData.labelFormat" :value="item.id" :key="item.id"
                                    :label="item.labelFormat" />
                            </a-select>
                        </a-form-item>
                    </a-col>
                    <a-col :span="4">
                        <a-form-item field="settlementName" label="结算方式:" label-col-flex="100px">
                            <a-select popup-container="html"  :style="{ width: '320px' }" v-model="form.settlementName" allow-clear>
                                <a-option v-for="item of basicData.Calculation" :value="item.id" :key="item.id"
                                    :label="item.settlementName" />
                            </a-select>
                        </a-form-item>
                    </a-col>
                    <a-col :span="4">
                        <a-form-item field="season" label="季节:" label-col-flex="100px">
                            <a-select popup-container="html"  :style="{ width: '320px' }" v-model="form.season" allow-clear>
                                <a-option v-for="item of basicData.seasonSet" :value="item.id" :key="item.id"
                                    :label="item.seasonName" />
                            </a-select>
                        </a-form-item>
                    </a-col>
                    <a-col :span="4">
                        <a-form-item field="dyeAuditDate" label="染单审核时间:" label-col-flex="100px">
                            <a-input v-model="form.dyeAuditDate" />
                        </a-form-item>
                    </a-col>
                    <a-col :span="4">
                        <a-form-item field="saleType" label="销售类型:" label-col-flex="100px">
                            <a-select popup-container="html"  :style="{ width: '320px' }" v-model="form.saleType" allow-clear>
                                <a-option v-for="item of basicData.saleType" :value="item.id" :key="item.id"
                                    :label="item.saleType" />
                            </a-select>
                        </a-form-item>
                    </a-col>
                </a-row>

                <a-row :gutter="16">
                    <a-col :span="4">
                        <a-form-item field="clientProductionMode" label="客户生产方式:" label-col-flex="100px">
                            <a-input v-model="form.clientProductionMode" />
                        </a-form-item>
                    </a-col>
                    <a-col :span="4">
                        <a-form-item field="informRemark" label="发货通知备注:" label-col-flex="100px">
                            <a-select popup-container="html"  :style="{ width: '320px' }" v-model="form.informRemark" allow-clear>
                            </a-select>
                        </a-form-item>
                    </a-col>
                    <a-col :span="4">
                        <a-form-item field="account" label="业务员:" label-col-flex="100px">
                            <a-select popup-container="html"  :style="{ width: '320px' }" v-model="form.account" allow-clear>
                                <a-option v-for="item of basicData.hrEmployee" :value="item.id" :key="item.id"
                                    :label="item.text" />
                            </a-select>
                        </a-form-item>
                    </a-col>
                    <a-col :span="4">
                        <a-form-item field="cause" label="交期更改原因:" label-col-flex="100px">
                            <a-input v-model="form.cause" />
                        </a-form-item>
                    </a-col>
                    <a-col :span="4">
                        <a-form-item field="colourSum" label="颜色总数:" label-col-flex="100px">
                            <a-input v-model="form.colourSum" />
                        </a-form-item>
                    </a-col>
                </a-row>
            </a-form>

            <a-tabs   :lazy-load="true" default-active-key="2">
                <a-tab-pane key="1" title="订单明细列表">
                    <div class="my-tool-bar">
                        <a-button type="primary">取布种客户要求</a-button>
                    </div>
                    <div style="height:15px;"></div>
                    <AgGridVuesCopys style="height:400px" class="ag-theme-alpine" :columnDefs="tco"
                        :rowData="form.planOrderDetails" :defaultColDef="defaultColDef" rowSelection="multiple"
                        @grid-ready="gridReadye">
                    </AgGridVuesCopys>
                    <!-- <AgGridVuesCopys style="height:56vh;" class="ag-theme-alpine" :columnDefs="tc" :rowData="tableCon.tableConter"
                    :defaultColDef="defaultColDef" rowSelection="multiple" @grid-ready="gridReady">
                </AgGridVuesCopys> -->

                </a-tab-pane>
                <a-tab-pane key="2" title="总部坯布信息">
                    <div class="my-tool-bar">
                        <a-button type="primary">查询</a-button>
                    </div>
                    <div style="height:15px;"></div>
                    <!-- <a-table :columns="total" :data="form.planOderGreys" /> -->
                    <AgGridVuesCopys style="height:35vh;" class="ag-theme-alpine" :columnDefs="total"
                        :rowData="form.planOderGreys" :defaultColDef="defaultColDef" rowSelection="multiple"
                        @grid-ready="gridReady">
                    </AgGridVuesCopys>
                </a-tab-pane>
                <a-tab-pane key="3" title="色号最新生产车间">
                    <div class="my-tool-bar">
                        <a-button type="primary">查询</a-button>
                    </div>
                    <div style="height:15px;"></div>
                    <!-- <a-table :columns="colorCar" :data="form.planOrderWorkshop" /> -->
                    <AgGridVuesCopys style="height:35vh;" class="ag-theme-alpine" :columnDefs="colorCar"
                        :rowData="form.planOrderWorkshop" :defaultColDef="defaultColDef" rowSelection="multiple"
                        @grid-ready="gridReady">
                    </AgGridVuesCopys>
                </a-tab-pane>
                <a-tab-pane key="4" title="管型设置">
                    <div class="tjan">
                        <div class="shruq-but" @click="bzyqAdd">
                            <span>添加</span>
                        </div>
                    </div>
                    <AgGridVuesCopys style="height:400px" class="ag-theme-alpine" :columnDefs="tcy"
                        :rowData="form.planorderCast" :defaultColDef="defaultColDef" :enableColResize="true"
                        rowSelection="multiple" @grid-ready="gridReadye">
                    </AgGridVuesCopys>
                </a-tab-pane>
            </a-tabs>
        </div>
    </a-drawer>

    <a-drawer :drawer-style="{ 'zIndex': 9999 }" placement="bottom" :mask-closable="false" width="100" height="100%"
        :visible="pageData.importAdd" unmountOnClose @ok="sideOk" @cancel="pageData.importAdd = false" cancel-text='关闭'
        ok-text='保存'>
        <template #title>
            <div style="position: absolute; right: 50px;">
                <Toolbar :items="['查询 ', '确定', 'Excel资料导入', '导出']" @add="addHandler" @import="importHandler"
                    @del="deleteHandler" @select="selectHandler" @export="exports" @excel="downloadHandler">
                </Toolbar>
            </div>
            <a-button type="primary" @click="importHandler">导入后台巨客户按钮</a-button>
        </template>
        <div>
            <a-form :model="form">
                <a-row :gutter="16">
                    <a-col :span="4">
                        <a-form-item field="orderCode" label="客户订单号:" label-col-flex="100px">
                            <a-input v-model="form.orderCode" />
                        </a-form-item>
                    </a-col>
                    <a-col :span="4">
                        <a-form-item field="authorizedStrengthTime" label="布号:" label-col-flex="100px">
                            <a-select popup-container="html"  :style="{ width: '320px' }" v-model="form.authorizedStrengthTime" allow-clear>
                            </a-select>
                        </a-form-item>
                    </a-col>
                    <a-col :span="4">
                        <a-form-item field="productionMode" label="品名:" label-col-flex="100px">
                            <a-select popup-container="html"  :style="{ width: '320px' }" v-model="form.productionMode"
                                placeholder="Please select ..." allow-clear>
                            </a-select>
                        </a-form-item>
                    </a-col>
                    <a-col :span="4">
                        <a-form-item field="customName" label="色号:" label-col-flex="100px">
                            <a-input v-model="form.customName" />
                        </a-form-item>
                    </a-col>
                    <a-col :span="4">
                        <a-form-item field="constitute" label="色称:" label-col-flex="100px">
                            <a-input v-model="form.constitute" placeholder="please enter..." />
                        </a-form-item>
                    </a-col>
                </a-row>
            </a-form>
        </div>
        <div style="height:15px;"></div>
        <a href="#" style="color:blue">订单明细列表</a>
        <div style="height:10px;"></div>
        <AgGridVuesCopys style="height:72vh;" class="ag-theme-alpine" :columnDefs="hugeCustomer" :rowData="orderCustomList.list"
            :defaultColDef="defaultColDef" rowSelection="multiple" @grid-ready="gridReady">
        </AgGridVuesCopys>
    </a-drawer>
</template>

<script lang="ts">

import { Search, CirclePlus, Delete } from "@element-plus/icons-vue";

import { post, get } from "@/api/http";
import {
    useTable,
    useRowKey,
    useTableColumn,
    usePagination,
    useRowSelection,
} from "@/hooks/table";

import { ref, reactive, onMounted, onActivated, onUnmounted } from "vue";
import Toolbar from "@/components/Toolbar.vue";
import { Form, Message, Modal, Pagination } from "@arco-design/web-vue";
import { FormInstance } from "@arco-design/web-vue/es/form";
import emitter from "@/hooks/useEventBus";
import validate from "@/hooks/useValidate";
//import { baseURL } from '../../../api/axios.config'
import axios from "axios";
import filedownload from 'js-file-download';

import "ag-grid-community/styles/ag-grid.css";
import "ag-grid-community/styles/ag-theme-alpine.css";
import {  } from "ag-grid-vue3";
import { each } from 'lodash';

interface ClothSet {
    id: any;
    serialNumber: number | undefined,
    mercery: string | undefined;
    deleteState: any
    remark: string | undefined;
    createName: string | undefined;
    createTime: string | undefined;
    updateName: string | undefined;
    updateTime: string | undefined;
    /**************************************/

}
interface pagings {
    size: number | string,
    total: number | string,
}


export default {
    name: "PlanOrder",
    setup() {
        const headerShow = ref<boolean>(true)
        //查询
        const scrollbar = ref(true)
        const pages = ref(1);
        const paging: pagings = reactive({
            size: 10,
            total: 30,
        })
        let columnDefs = [
            {
                headerName: '',//选择列头部显示的文字，可以为空
                checkboxSelection: true,//设置为ture显示为复选框
                headerCheckboxSelection: true, //表头是否也显示复选框，全选反选用
                pinned: 'left', //固定再左边
                width: 50 //列的宽度
            },
            { headerName: "下单日期", field: "name", },
            { headerName: "订单号", field: "orderCode" },
            { headerName: "客户PO", field: "customPoCode" },
            { headerName: "客户名称", field: "customName", },
            { headerName: "客订名称", field: "customOrderName" },
            { headerName: "销售类型", field: "saleType" },

            { headerName: "客户染整单号", field: "'clientDyeCode'", },
            { headerName: "加工类型", field: "machinType" },
            { headerName: "客户计划单号", field: "customOrderName" },
            { headerName: "下单部门", field: "placeDepartment", },
            { headerName: "布号", field: "clothCode" },
            { headerName: "品名", field: "productName" },

            { headerName: "色号", field: "colorCode", },
            { headerName: "色称", field: "colorName" },
            { headerName: "确认色", field: "affirmColor" },
            { headerName: "坯布编号", field: "greyCode", },
            { headerName: "坯布名称", field: "greyName" },
            { headerName: "匹数", field: "houseNum" },

            { headerName: "成品重量（KG）", field: "finishedWeight", },
            { headerName: "投染重量（KG）", field: "castDyeWeight" },
            { headerName: "投染长度（M）", field: "castDyeLength" },
            { headerName: "成品长度（M）", field: "finishedLength", },
            { headerName: "对色资料", field: "contrastColor" },
            { headerName: "染色类型", field: "dyeingType" },

            { headerName: "布种类别", field: "greyType", },
            { headerName: "颜色深浅", field: "colorDepth" },
            { headerName: "整理收费项目", field: "trimCharges" },
            { headerName: "费用构成", field: "feeConstitute", },
            { headerName: "最终交货日期", field: "lastDeliveryTime" },
            { headerName: "总部交货日期", field: "hqDeliveryTime" },

            { headerName: "交货日间", field: "deliveryTime", },
            { headerName: "成分", field: "ingredient" },
            { headerName: "纱支", field: "yarnCount" },
            { headerName: "有效门幅（cm）", field: "efficacious", },
            { headerName: "克重（g/m2）", field: "gWeight" },
            { headerName: "状态", field: "email" },
            { headerName: "操作", },

        ];
        const rowData = [
            { make: "Toyota", model: "Celica", price: 35000 },
            { make: "Ford", model: "Mondeo", price: 32000 },
            { make: "Porsche", model: "Boxster", price: 72000 },
            { make: "Toyota", model: "Celica", price: 35000 },
            { make: "Ford", model: "Mondeo", price: 32000 },
            { make: "Porsche", model: "Boxster", price: 72000 },
            { make: "Toyota", model: "Celica", price: 35000 },
            { make: "Ford", model: "Mondeo", price: 32000 },
            { make: "Porsche", model: "Boxster", price: 72000 },
        ];
        const defaultColDef = {
            sortable: true,
            filter: true,
            // flex: null,
            resizable: true,
        };
        const fromList = {
            endTime: '',
            ColorId: '',
            ColorName: '',
            customName: "",
            clientDyeCode: "",
            genDanCode: "",
            dyType: '',
            account: ''
        }
        const InformationEnglishbt = [
            { headerName: "序号", field: "castNum", },
            {
                headerName: "管型", field: "RetainingNum",
                editable: true,
                cellEditor: "agSelectCellEditor",
                cellEditorParams: { values: [6, 5, 4, 3, 2, 1] }
            },
            { headerName: "缸数", field: "remark" },
            { headerName: "操作", },
        ];
        const defaultColDefy = {
            sortable: true,
            filter: true,
            // flex: 1,
            resizable: true,
            editable: true,
        };
        const gridOptiony = ref()
        const gridReadye = (params: any,) => {
            gridOptiony.value = params.api
            console.log("触发");
        }

        const planorderCast = [
            {
                castNum: 1,
                RetainingNum: 1,
                remark: 1
            }
        ]

        const bzyqAdd = () => {
            form.planorderCast.push(JSON.parse(JSON.stringify(planorderCast)));
            setTimeout(function () { gridOptiony.value.setRowData(tableCon.bzyq); }, 0)
        }

        const columnsOrder = [
            {
                headerName: "快反需求状态",
                field: "needState",

            },
            {
                headerName: "布号",
                field: "clothCode",
                editable: true,
                cellEditor: "agSelectCellEditor",
                cellEditorParams: { values: [1, 2] }
            },
            { headerName: "品名", field: "productName" },

            {
                headerName: "色号",
                field: "colorCode",
                editable: true,
                cellEditor: "agSelectCellEditor",
                cellEditorParams: { values: [1, 2] }
            },
            { headerName: "色称", field: "colorName" },
            {
                headerName: "确认色",
                field: "affirmColor",
                cellEditor: "agSelectCellEditor",
                editable: true,
                cellEditorParams: { values: [1, 2] }
            },

            {
                headerName: "坯布编号",
                field: "greyCode",
                editable: true,
                cellEditor: "agSelectCellEditor",
                cellEditorParams: { values: [1, 2] }
            },


            { headerName: "坯布名称", field: "greyName", },
            { headerName: "匹数", field: "houseNum", editable: true, },

            { headerName: "成品重量", field: "finishedWeight", editable: true, },
            { headerName: "投染重量", field: "castDyeWeight", editable: true, },
            { headerName: "投染长度", field: "castDyeLength", editable: true, },

            { headerName: "成品长度", field: "finishedLength", editable: true, },
            {
                headerName: "对色资料",
                field: "contrastColor",
                cellEditor: "agSelectCellEditor",
                editable: true,
                cellEditorParams: { values: [1, 2] }
            },
            { headerName: "珠地边", field: "edge" },

            { headerName: "撞白", field: "bumpWhite", },
            { headerName: "一等品", field: "firstRate", },
            { headerName: "拔印", field: "dialPrinting" },

            { headerName: "抗黄处理", field: "resistanceYellow", editable: true, },
            { headerName: "耐氢替身", field: "chlorineResistant", editable: true, },
            { headerName: "温差提升", field: "wetRubbing" },

            { headerName: "白色RC处理", field: "rcInfo", },
            { headerName: "白色防粘处理", field: "stainResistance", },
            {
                headerName: "染色类型",
                field: "dyeingType",
                editable: true,
                cellEditor: "agSelectCellEditor",
                cellEditorParams: { values: [1, 2] }
            },

            {
                headerName: "布种类别",
                field: "greyType",
                editable: true,
                cellEditor: "agSelectCellEditor",
                cellEditorParams: { values: [1, 2] }
            },
            {
                headerName: "工艺代码",
                field: "craftCode",
                editable: true,
                cellEditor: "agSelectCellEditor",
                cellEditorParams: { values: [1, 2] }
            },
            {
                headerName: "颜色深浅",
                field: "colorDepth",
                editable: true,
                cellEditor: "agSelectCellEditor",
                cellEditorParams: { values: [1, 2] }
            },

            {
                headerName: "整理收费项目",
                field: "trimCharges",
                editable: true,
                cellEditor: "agSelectCellEditor",
                cellEditorParams: { values: [1, 2] }
            },
            { headerName: "需进缸", field: "needEnterPot" },
            { headerName: "合染类型", field: "joinDyeType" },

            { headerName: "收取染费", field: "takeDyeFee", },
            { headerName: "重打包", field: "repeatPack", },
            { headerName: "计件克重", field: "byPieceBreadth" },

            { headerName: "染色单价", field: "dyeUnitPrice", },
            { headerName: "总部染色单价", field: "hqUnitPrice", editable: true, },
            { headerName: "待整单价", field: "veryPrice", editable: true, },

            { headerName: "胶带单价", field: "polybagPrice", editable: true, },
            { headerName: "纸管单价", field: "tubePrice", editable: true, },
            { headerName: "税率", field: "taxRate", editable: true, },

            {
                headerName: "费用构成",
                field: "feeConstitute",
                editable: true,
                cellEditor: "agSelectCellEditor",
                cellEditorParams: { values: [1, 2] }
            },
            { headerName: "齐胚日期", field: "neatEmbryoTime", },
            { headerName: "交货日期", field: "deliveryTime" },

            { headerName: "成分", field: "ingredient" },
            { headerName: "纱支", field: "yarnCount", },
            { headerName: "备坯订单号", field: "embryoOrderNumber" },

            { headerName: "客户布号", field: "customClothCode", editable: true, },
            { headerName: "客户品名", field: "customProductName", editable: true, },
            { headerName: "客户色号", field: "customColorCode", editable: true, },

            { headerName: "客户色称", field: "customColorName", editable: true, },
            { headerName: "有效门幅（CM）", field: "efficacious", },
            { headerName: "克重（G/M2）", field: "gramWeight", },

            { headerName: "门幅上限", field: "upperLimit", editable: true, },
            { headerName: "门幅下限", field: "lowerLimit", editable: true, },
            { headerName: "克重上限", field: "gramUpperLimit", editable: true, },

            { headerName: "克重下限", field: "gramLowerLimit", editable: true, },
            { headerName: "开卡缸数", field: "numberCylinders", },
            { headerName: "款号", field: "styleNumber" },

            {
                headerName: "快反需求人员",
                field: "needPersonnel",
                editable: true,
                cellEditor: "agSelectCellEditor",
                cellEditorParams: { values: [1, 2] }
            },
            { headerName: "快反需求日期", field: "needTime", editable: true, },

            { headerName: "总部色卡号", field: "hqCardNumber", },
            { headerName: "原色号", field: "rawColorCode", },
            { headerName: "原色称", field: "rawColorName", },

            { headerName: "币种", field: "currency" },
            { headerName: "结算重量", field: "closeAccountWeight", },
            { headerName: "结算单位", field: "closeAccountUnit" },
            { headerName: "制版费", field: "makeEditionCost" },

            { headerName: "操作", },
        ];

        const planorderCastDefy = {
            sortable: false,
            filter: false,
            flex: null,
            resizable: false,
        }

        let form = reactive({
            orderCode: "",
            authorizedStrengthTime: Date.now(),
            productionMode: "",
            customName: "",
            constitute: "",
            lastDeliveryTime: "",


            customOrderCode: "",
            workshop: "",
            salesDepartment: "",
            customOrderName: "",
            hqDeliveryTime: "",
            require: "",


            customPoCode: "",
            testCriterion: "",
            machinType: "",
            clientDocumentary: "",
            marketingDeliveryTime: "",
            marketType: "",



            clientDyeCode: "",
            coloringIlluminant: "",
            orderNature: "",
            placeDepartment: "",
            initialDeliveryTime: "",
            circulatCardType: "",



            clientPlanOrderCode: "",
            handDatum: "",
            settlementFirm: "粤隆纺织",
            ultimatelyBuyer: "",
            urgentCategory: "",
            remark: "",


            clientBillsType: "",
            labelFormatCode: "",
            settlementName: "",
            season: "",
            dyeAuditDate: "",
            saleType: "",


            clientProductionMode: "",
            informRemark: "",
            crockCost: "",
            account: "",
            cause: "",
            colourSum: 1,

            planOrderDetails: [
                {
                    needState: 0,
                    clothCode: "qqqqqqq",
                    productName: "qqq",
                    colorCode: "",
                    colorName: "",
                    affirmColor: "",
                    greyCode: "",
                    greyName: "",
                    houseNum: 0,
                    finishedWeight: 0,
                    castDyeWeight: 0,
                    castDyeLength: 0,
                    finishedLength: 0,
                    contrastColor: "",
                    edge: 0,
                    bumpWhite: 0,
                    firstRate: 0,
                    dialPrinting: 0,
                    resistanceYellow: "",
                    chlorineResistant: "",
                    wetRubbing: 0,
                    rcInfo: 0,
                    stainResistance: 0,
                    dyeingType: "",
                    greyType: "",
                    craftCode: "",
                    colorDepth: "",
                    trimCharges: "",
                    needEnterPot: 0,
                    joinDyeType: "",
                    takeDyeFee: 0,
                    repeatPack: 0,
                    byPieceBreadth: 0,
                    byPieceGramWeight: 0,
                    dyeUnitPrice: 0,
                    hqUnitPrice: 0,
                    veryPrice: 0,
                    polybagPrice: 0,
                    tubePrice: 0,
                    taxRate: "",
                    feeConstitute: "",
                    neatEmbryoTime: "",
                    deliveryTime: "",
                    ingredient: "",
                    yarnCount: "",
                    embryoOrderNumber: "",
                    customClothCode: "",
                    customProductName: "",
                    customColorCode: "",
                    customColorName: "",
                    efficacious: "",
                    gramWeight: 0,
                    upperLimit: "",
                    lowerLimit: "",
                    gramUpperLimit: 0,
                    gramLowerLimit: 0,
                    numberCylinders: 0,
                    styleNumber: "",
                    tradeName: "",
                    finishedClothCode: "",
                    finishedClothName: "",
                    needPersonnel: "",
                    needTime: "",
                    hqCardNumber: "",
                    rawColorCode: "",
                    rawColorName: "",
                    currency: "",
                    closeAccountWeight: 0,
                    closeAccountUnit: "",
                    makeEditionCost: 0
                },
            ],
            requirement: [{
                requiredItems: "",
                nowRequirement: "",
                defaultRequirement: "",
                unit: "",
                greyType: "",
                remark: "",
            }],
            planOderGreys: [{
                greyCode: "",
                greyName: "",
                yarnHouseNum: "",
                houseNum: "",
                weight: "",
                lenghtNum: "",
                clothCode: "",
                productName: "",
                colorCode: "",
                colorName: "",
                larghezza: "",
                gWeight: "",
                grade: "",
                setoutGreyCode: "",
                remark: ""
            }],
            planOrderWorkshop: [{
                planOrderCode: "",
                clothCode: "",
                productName: "",
                colorCode: "",
                colorName: "",
                flowCardCode: "",
                waitProcess: "",
                createOrderDate: "",
                workshop: "",
                houseNum: 1,
                createOrderPerson: "",
                remark: ""
            }],
            planorderCast: [
                {
                    castaaaa: 0,
                    castNum: 1,
                    RetainingNum: 1,
                    remark: 1
                }
            ]


        });
        let tcoChx = ref(0);
        let tco: any[] = columnsOrder.map((o) => {
            //let obj = {}
            if (o.headerName === '操作') {
                o['resizable'] = true
                o['filter'] = false
                o['sortable'] = false
                o["pinned"] = "right"
                o["width"] = 70
                o['cellRenderer'] = {
                    template: `<div>
                               <a-tag color="#f53f3f"  @click="s">删除</a-tag>
                              </div>`,
                    setup(props: any) {
                        const s = () => {
                            deleteBzyq(props.params.rowIndex)
                        }
                        return {
                            s
                        }
                    }

                }
            }
            if (o.headerName == '快反需求状态') {
                o['resizable'] = false
                o['filter'] = false
                o['sortable'] = false
                o["pinned"] = "light"
                o["width"] = 150
                o['cellRenderer'] = {
                    template: `<div>
                        <a-checkbox @click="s"></a-checkbox>
                              </div>`,
                    setup(props: any) {
                        const s = () => {

                            form.planOrderDetails[props.params.rowIndex].needState = form.planOrderDetails[props.params.rowIndex].needState == 0 ? 1 : 0

                        }
                        return {
                            s
                        }
                    }

                }
            }
            if (o.headerName == '珠地边') {
                o['resizable'] = false
                o['filter'] = false
                o['sortable'] = false
                o["pinned"] = "light"
                o["width"] = 150
                o['cellRenderer'] = {
                    template: `<div>
                        <a-checkbox @click="s"></a-checkbox>
                              </div>`,
                    setup(props: any) {
                        const s = () => {
                            form.planOrderDetails[props.params.rowIndex].edge = form.planOrderDetails[props.params.rowIndex].edge == 0 ? 1 : 0
                        }
                        return {
                            s
                        }
                    }

                }
            }
            if (o.headerName == '撞白') {
                o['resizable'] = false
                o['filter'] = false
                o['sortable'] = false
                o["pinned"] = "light"
                o["width"] = 150
                o['cellRenderer'] = {
                    template: `<div>
                        <a-checkbox @click="s"></a-checkbox>
                              </div>`,
                    setup(props: any) {
                        const s = () => {
                            form.planOrderDetails[props.params.rowIndex].bumpWhite = form.planOrderDetails[props.params.rowIndex].bumpWhite == 0 ? 1 : 0
                        }
                        return {
                            s
                        }
                    }

                }
            }
            if (o.headerName == '一等品') {
                o['resizable'] = false
                o['filter'] = false
                o['sortable'] = false
                o["pinned"] = "light"
                o["width"] = 150
                o['cellRenderer'] = {
                    template: `<div>
                        <a-checkbox @click="s"></a-checkbox>
                              </div>`,
                    setup(props: any) {
                        const s = () => {
                            form.planOrderDetails[props.params.rowIndex].firstRate = form.planOrderDetails[props.params.rowIndex].firstRate == 0 ? 1 : 0
                        }
                        return {
                            s
                        }
                    }

                }
            }
            if (o.headerName == '拔印') {
                o['resizable'] = false
                o['filter'] = false
                o['sortable'] = false
                o["pinned"] = "light"
                o["width"] = 150
                o['cellRenderer'] = {
                    template: `<div>
                        <a-checkbox @click="s"></a-checkbox>
                              </div>`,
                    setup(props: any) {
                        const s = () => {
                            form.planOrderDetails[props.params.rowIndex].dialPrinting = form.planOrderDetails[props.params.rowIndex].dialPrinting == 0 ? 1 : 0
                        }
                        return {
                            s
                        }
                    }

                }
            }

            if (o.headerName == '温差提升') {
                o['resizable'] = false
                o['filter'] = false
                o['sortable'] = false
                o["pinned"] = "light"
                o["width"] = 150
                o['cellRenderer'] = {
                    template: `<div>
                        <a-checkbox @click="s"></a-checkbox>
                              </div>`,
                    setup(props: any) {
                        const s = () => {
                            form.planOrderDetails[props.params.rowIndex].wetRubbing = form.planOrderDetails[props.params.rowIndex].wetRubbing == 0 ? 1 : 0
                        }
                        return {
                            s
                        }
                    }

                }
            }

            if (o.headerName == '白色RC处理') {
                o['resizable'] = false
                o['filter'] = false
                o['sortable'] = false
                o["pinned"] = "light"
                o["width"] = 150
                o['cellRenderer'] = {
                    template: `<div>
                        <a-checkbox @click="s"></a-checkbox>
                              </div>`,
                    setup(props: any) {
                        const s = () => {
                            form.planOrderDetails[props.params.rowIndex].rcInfo = form.planOrderDetails[props.params.rowIndex].rcInfo == 0 ? 1 : 0
                        }
                        return {
                            s
                        }
                    }

                }
            }

            if (o.headerName == '白色防粘处理') {
                o['resizable'] = false
                o['filter'] = false
                o['sortable'] = false
                o["pinned"] = "light"
                o["width"] = 150
                o['cellRenderer'] = {
                    template: `<div>
                        <a-checkbox @click="s"></a-checkbox>
                              </div>`,
                    setup(props: any) {
                        const s = () => {
                            form.planOrderDetails[props.params.rowIndex].stainResistance = form.planOrderDetails[props.params.rowIndex].stainResistance == 0 ? 1 : 0
                        }
                        return {
                            s
                        }
                    }

                }
            }

            if (o.headerName == '需进缸') {
                o['resizable'] = false
                o['filter'] = false
                o['sortable'] = false
                o["pinned"] = "light"
                o["width"] = 150
                o['cellRenderer'] = {
                    template: `<div>
                        <a-checkbox @click="s"></a-checkbox>
                              </div>`,
                    setup(props: any) {
                        const s = () => {
                            form.planOrderDetails[props.params.rowIndex].needEnterPot = form.planOrderDetails[props.params.rowIndex].needEnterPot == 0 ? 1 : 0
                        }
                        return {
                            s
                        }
                    }

                }
            }

            if (o.headerName == '收取染费') {
                o['resizable'] = false
                o['filter'] = false
                o['sortable'] = false
                o["pinned"] = "light"
                o["width"] = 150
                o['cellRenderer'] = {
                    template: `<div>
                        <a-checkbox @click="s"></a-checkbox>
                              </div>`,
                    setup(props: any) {
                        const s = () => {
                            form.planOrderDetails[props.params.rowIndex].takeDyeFee = form.planOrderDetails[props.params.rowIndex].takeDyeFee == 0 ? 1 : 0
                        }
                        return {
                            s
                        }
                    }

                }
            }

            if (o.headerName == '重打包') {
                o['resizable'] = false
                o['filter'] = false
                o['sortable'] = false
                o["pinned"] = "light"
                o["width"] = 150
                o['cellRenderer'] = {
                    template: `<div>
                        <a-checkbox @click="s"></a-checkbox>
                              </div>`,
                    setup(props: any) {
                        const s = () => {
                            form.planOrderDetails[props.params.rowIndex].repeatPack = form.planOrderDetails[props.params.rowIndex].repeatPack == 0 ? 1 : 0
                        }
                        return {
                            s
                        }
                    }

                }
            }

            if (o.headerName == '重打包') {
                o['resizable'] = false
                o['filter'] = false
                o['sortable'] = false
                o["pinned"] = "light"
                o["width"] = 150
                o['cellRenderer'] = {
                    template: `<div>
                        <a-checkbox @click="s"></a-checkbox>
                              </div>`,
                    setup(props: any) {
                        const s = () => {
                            form.planOrderDetails[props.params.rowIndex].repeatPack = form.planOrderDetails[props.params.rowIndex].repeatPack == 0 ? 1 : 0
                        }
                        return {
                            s
                        }
                    }

                }
            }

            return o
        })

        let tcy: any[] = InformationEnglishbt.map((o) => {
            //let obj = {}
            if (o.headerName === '操作') {
                o['resizable'] = true
                o['filter'] = false
                o['sortable'] = false
                o["pinned"] = "right"
                o["width"] = 70
                o['cellRenderer'] = {
                    template: `<div>
                               <a-tag color="#f53f3f"  @click="s">删除</a-tag>
                              </div>`,
                    setup(props: any) {
                        const s = () => {
                            deleteBzyq(props.params.rowIndex)
                        }
                        return {
                            s
                        }
                    }

                }
            }
            return o
        })


        let tc: any[] = columnDefs.map((o) => {
            //let obj = {}
            if (o.headerName === '操作') {
                o['resizable'] = false
                o['filter'] = false
                o['sortable'] = false
                o["pinned"] = "right"
                o["width"] = 80
                o['cellRenderer'] = {
                    template: `<a-tag color="#ff7d00"  @click="a">修改</a-tag>`,
                    setup(props: any) {
                        const a = () => {
                            editHandler(props.params.data)
                        }
                        return {
                            a
                        }
                    }

                }
            }
            return o
        })

        let ta: any[] = columnDefs.slice(0, 35)

        // let cb = {
        //     obj['cellRenderer'] = checkBoxRender
        // }
        const gridOption = ref()
        const gridReady = (params: any) => {
            console.log(params, 'aaaaaaaaaaaaaaaaaaaaaaaaaaa');
            gridOption.value = params.api
        }

        function doRefresh() {
            pageData.pageLoading = true

            post({
                url: "/aps/planOrder/getPage",
                data: {
                    page: pages.value,
                    limit: paging.size,
                },
            })
                .then(({ data, code }: any) => {
                    if (code === 200) {
                        tableCon.tableConter = data.data;
                        paging.total = data.total;
                    }
                })
                .catch(console.log).finally(() => {
                    pageData.pageLoading = false
                })

            getProductionMode()

        }

        //客总信息
        function totalGetList() {
            pageData.pageLoading = true
            post({
                url: "/aps/planOrderGrey/getList",
                data: {
                    planOrderId: 0
                }
            }).then(({ data, code }: any) => {
                if (code === 200) {
                    totaInfolList.totalList = data.data
                }
            }).catch(console.log).finally(() => {
                pageData.pageLoading = false
            })
        }

        //色号生产车间
        function colorGetList() {
            pageData.pageLoading = true
            post({
                url: "/aps/planOrder/getWorkshopInfo",
                data: {
                    colorCode: "测试01"
                }
            }).then(({ data, code }: any) => {
                if (code === 200) {
                    totaInfolList.totalList = data.data
                }
            }).catch(console.log).finally(() => {
                pageData.pageLoading = false
            })
        }

        //导入巨客户按钮
        function hugeCustomerGetList() {
            pageData.pageLoading = true
            post({
                url: "/aps/planOrder/getWorkshopInfo",
                data: {
                    colorCode: "测试01"
                }
            }).then(({ data, code }: any) => {
                if (code === 200) {
                    totaInfolList.totalList = data.data
                }
            }).catch(console.log).finally(() => {
                pageData.pageLoading = false
            })
        }

        const { selectedRowKeys, onSelectionChange } = useRowSelection();
        const pagination = usePagination(doRefresh);
        const table = useTable();
        const rowKey = useRowKey("id");
        //检验表单是否含有中文的方法
        const hasChiese = validate.includeChinese;
        const optionsorder = {
            Beijing: ['Haidian', 'Chaoyang', 'Changping'],
            Sichuan: ['Chengdu', 'Mianyang', 'Aba'],
            Guangdong: ['Guangzhou', 'Shenzhen', 'Shantou']
        };
        const tableCon = reactive({
            tableConter: []
        });
        const totaInfolList = reactive({
            totalList: []
        })

        const colorCarList = reactive({
            colorList: []
        })

        const hugeCustomerList = reactive({
            hugeList: []
        })



        const dataOrder = reactive([{
            key: '1',
            name: 'Jane Doe',
            salary: 23000,
            address: '32 Park Road, London',
            province: 'Beijing',
            city: 'Haidian',
            email: 'jane.doe@example.com'
        }, {
            key: '2',
            name: 'Alisa Ross',
            salary: 25000,
            address: '35 Park Road, London',
            email: 'alisa.ross@example.com'
        }, {
            key: '3',
            name: 'Kevin Sandra',
            salary: 22000,
            address: '31 Park Road, London',
            province: 'Sichuan',
            city: 'Mianyang',
            email: 'kevin.sandra@example.com'
        }, {
            key: '4',
            name: 'Ed Hellen',
            salary: 17000,
            address: '42 Park Road, London',
            email: 'ed.hellen@example.com'
        }, {
            key: '5',
            name: 'William Smith',
            salary: 27000,
            address: '62 Park Road, London',
            email: 'william.smith@example.com'
        }]);

        const columns = [
            {
                title: '下单日期',
                key: "name",
                width: 150,
                align: "center",
                dataIndex: 'name',
            },
            {
                title: '订单号',
                key: "orderCode",
                width: 150,
                dataIndex: 'orderCode',
                align: "center"
            },
            {
                title: '客户PO',
                key: "customPoCode",
                width: 150,
                dataIndex: 'customPoCode',
                align: "center"
            },
            {
                title: '客户名称',
                key: "customName",
                width: 150,
                dataIndex: 'customName',
                align: "center"
            },
            {
                title: '客订名称',
                key: "customOrderName",
                width: 150,
                dataIndex: 'customOrderName',
                align: "center"
            },
            {
                title: '销售类型',
                key: "saleType",
                width: 150,
                dataIndex: 'saleType',
                align: "center"
            },
            {
                title: '客户染整单号',
                key: "clientDyeCode",
                width: 150,
                dataIndex: 'clientDyeCode',
                align: "center"
            },
            {
                title: '加工类型',
                key: "machinType",
                width: 150,
                dataIndex: 'machinType',
                align: "center"
            },
            {
                title: '客户计划单号',
                key: "customOrderName",
                width: 150,
                dataIndex: 'customOrderName',
                align: "center"
            },
            {
                title: '下单部门',
                key: "placeDepartment",
                width: 150,
                dataIndex: 'placeDepartment',
                align: "center"
            },
            {
                title: '布号',
                key: "clothCode",
                width: 150,
                dataIndex: 'clothCode',
                align: "center"
            },
            {
                title: '品名',
                key: "productName",
                width: 150,
                dataIndex: 'productName',
                align: "center"
            },
            {
                title: '色号',
                key: "colorCode",
                width: 150,
                dataIndex: 'colorCode',
                align: "center"
            },
            {
                title: '色称',
                key: "colorName",
                width: 150,
                dataIndex: 'colorName',
                align: "center"
            },
            {
                title: '确认色',
                key: "affirmColor",
                width: 150,
                dataIndex: 'affirmColor',
                align: "center"
            },
            {
                title: '坯布编号',
                key: "greyCode",
                width: 150,
                dataIndex: 'greyCode',
                align: "center"
            },
            {
                title: '坯布名称',
                key: "greyName",
                width: 150,
                dataIndex: 'greyName',
                align: "center"
            },
            {
                title: '匹数',
                key: "houseNum",
                width: 150,
                dataIndex: 'houseNum',
                align: "center"
            },
            {
                title: '成品重量（KG）',
                key: "finishedWeight",
                width: 150,
                dataIndex: 'finishedWeight',
                align: "center"
            },
            {
                title: '投染重量（KG）',
                key: "castDyeWeight",
                width: 150,
                dataIndex: 'castDyeWeight',
                align: "center"
            },

            {
                title: '投染长度（M）',
                key: "castDyeLength",
                width: 150,
                dataIndex: 'castDyeLength',
                align: "center"
            },

            {
                title: '成品长度（M）',
                key: "finishedLength",
                width: 150,
                dataIndex: 'finishedLength',
                align: "center"
            },
            {
                title: '对色资料',
                key: "contrastColor",
                width: 150,
                dataIndex: 'contrastColor',
                align: "center"
            },
            {
                title: '染色类型',
                key: "dyeingType",
                width: 150,
                dataIndex: 'dyeingType',
                align: "center"
            },

            {
                title: '布种类别',
                key: "greyType",
                width: 150,
                dataIndex: 'greyType',
                align: "center"
            },

            {
                title: '颜色深浅',
                key: "colorDepth",
                width: 150,
                dataIndex: 'colorDepth',
                align: "center"
            },
            {
                title: '整理收费项目',
                key: "trimCharges",
                width: 150,
                dataIndex: 'trimCharges',
                align: "center"
            },
            {
                title: '费用构成',
                key: "feeConstitute",
                width: 150,
                dataIndex: 'feeConstitute',
                align: "center"
            },
            {
                title: '最终交货日期',
                key: "lastDeliveryTime",
                width: 150,
                dataIndex: 'lastDeliveryTime',
                align: "center"
            },
            {
                title: '总部交货日期',
                key: "hqDeliveryTime",
                width: 150,
                dataIndex: 'hqDeliveryTime',
                align: "center"
            },
            {
                title: '交货日间',
                key: "deliveryTime",
                width: 150,
                dataIndex: 'deliveryTime',
                align: "center"
            },
            {
                title: '成分',
                key: "ingredient",
                width: 150,
                dataIndex: 'ingredient',
                align: "center"
            },
            {
                title: '纱支',
                key: "yarnCount",
                width: 150,
                dataIndex: 'yarnCount',
                align: "center"
            },
            {
                title: '有效门幅（cm）',
                key: "efficacious",
                width: 150,
                dataIndex: 'efficacious',
                align: "center"
            },
            {
                title: '克重（g/m2）',
                key: "gWeight",
                width: 150,
                dataIndex: 'gWeight',
                align: "center"
            },
            {
                title: '状态',
                key: "email",
                width: 150,
                dataIndex: 'email',
                align: "center"
            },
            {
                title: '操作',
                key: "id",
                width: 150,
                dataIndex: 'id',
                slotName: "action",
                fixed: 'right',
                align: "center"
            },
        ];



        const hugeCustomer = [
            {
                headerName: '',//选择列头部显示的文字，可以为空
                checkboxSelection: true,//设置为ture显示为复选框
                headerCheckboxSelection: true, //表头是否也显示复选框，全选反选用
                pinned: 'left', //固定再左边
                width: 50 //列的宽度
            },
            { headerName: "客户订单号", field: "customOrderCode", },
            { headerName: "卖家名称", field: "buyerName" },
            { headerName: "客户名称", field: "customOrderName" },
            { headerName: "客户跟单", field: "clientDocumentary", },
            { headerName: "下单日期", field: "authorizedStrengthTime" },
            { headerName: "交货日期", field: "deliveryTime" },
            { headerName: "季节", field: "season", },
            { headerName: "款号", field: "styleNumber" },
            { headerName: "布号", field: "colorCode" },
            { headerName: "品名", field: "productName", },
            { headerName: "系统品名", field: "systemProductName", },
            { headerName: "门幅", field: "larghezza" },
            { headerName: "克重", field: "gWeight" },
            { headerName: "颜色代码", field: "colorNum" },
            { headerName: "色号", field: "colorCode" },
            { headerName: "色称", field: "colorName" },
            { headerName: "确认色", field: "affirmColor" },
            { headerName: "客户色称", field: "customColorName" },
            { headerName: "对色资料", field: "contrastColor" },
            { headerName: "测试标准", field: "testCriterion" },
            { headerName: "成分", field: "ingredient" },
            { headerName: "po号", field: "customPoCode" },
            { headerName: "投染重量", field: "castDyeWeight" },
            { headerName: "投染码数", field: "castDyeYardage" },
            { headerName: "投染磅数", field: "castDyePound" },

            { headerName: "成品磅数", field: "finishedClothPound" },
            { headerName: "备注", field: "remark" },
            { headerName: "导入人", field: "importPerson" },
            { headerName: "导入日期", field: "importDate" },
            { headerName: "客户品名", field: "customProductName" },
        ];


        const total = [
            {
                headerName: '',//选择列头部显示的文字，可以为空
                checkboxSelection: true,//设置为ture显示为复选框
                headerCheckboxSelection: true, //表头是否也显示复选框，全选反选用
                pinned: 'left', //固定再左边
                width: 50 //列的宽度
            },
            { headerName: "坯布编号", field: "greyCode", },
            { headerName: "坯布名称", field: "greyName" },
            { headerName: "纱批", field: "yarnHouseNum" },
            { headerName: "匹数", field: "houseNum", },
            { headerName: "重量", field: "weight" },
            { headerName: "米数", field: "lenghtNum" },
            { headerName: "布号", field: "clothCode", },
            { headerName: "品名", field: "productName" },
            { headerName: "色号", field: "colorCode" },
            { headerName: "色称", field: "colorName", },
            { headerName: "门幅", field: "larghezza" },
        ];


        const colorCar = [
            {
                headerName: '',//选择列头部显示的文字，可以为空
                checkboxSelection: true,//设置为ture显示为复选框
                headerCheckboxSelection: true, //表头是否也显示复选框，全选反选用
                pinned: 'left', //固定再左边
                width: 50 //列的宽度
            },
            { headerName: "订单号", field: "planOrderCode", },
            { headerName: "布号", field: "clothCode" },
            { headerName: "品名", field: "productName" },
            { headerName: "色号", field: "colorCode", },
            { headerName: "色称", field: "colorName" },
            { headerName: "流转卡号", field: "flowCardCode" },


            { headerName: "等待工序", field: "waitProcess", },
            { headerName: "开卡日期", field: "createOrderDate" },
            { headerName: "生产车间", field: "workshop" },
            { headerName: "匹数", field: "houseNum", },
            { headerName: "制单人", field: "createOrde" },
            { headerName: "备注", field: "remark" },


        ];

        const data = reactive([{
            key: '1',
            name: 'Jane Doe',
            salary: 23000,
            address: '32 Park Road, London',
            email: 'jane.doe@example.com',

        }, {
            key: '2',
            name: 'Alisa Ross',
            salary: 25000,
            address: '35 Park Road, London',
            email: 'alisa.ross@example.com',

        }, {
            key: '3',
            name: 'Kevin Sandra',
            salary: 22000,
            address: '31 Park Road, London',
            email: 'kevin.sandra@example.com',

        }, {
            key: '4',
            name: 'Ed Hellen',
            salary: 17000,
            address: '42 Park Road, London',
            email: 'ed.hellen@example.com',

        }, {
            key: '5',
            name: 'William Smith',
            salary: 27000,
            address: '62 Park Road, London',
            email: 'william.smith@example.com',
        }]);
        const alone = (rowKeys, rowKey, record) => {
            console.log(rowKeys);
            console.log(rowKey);
            console.log(record);
        }
        const alonell = (selected, selectedRows,) => {
            console.log(selected);
            console.log(selectedRows);
        }
        const scroll = {
            x: 20000,
            y: 200
        };
        const tablediv = ref(null)
        const pageData = reactive<{
            clothList: ClothSet[]
            showAdd: boolean
            sideTitle: string
            dropDownData: any
            pageLoading: boolean,
            theight: number,
            tablediv: any,
            rHeight: number | undefined,
            importAdd: boolean
        }>({
            clothList: [],
            showAdd: false,
            sideTitle: "新增计划订单",
            dropDownData: "",
            pageLoading: false,
            theight: 0,
            tablediv: null,
            rHeight: 0,
            importAdd: false
        });
        //下拉框得到焦点
        const focusSel = () => {
            selCxAll({ mercery: "" })
        }
        //下拉数据
        const options = ref<any>(pageData.clothList);
        const loading = ref(false);
        const handleSearch = (value: any) => {
            if (value) {
                const ob = { mercery: value }
                loading.value = true;
                selCxAll(ob);
                options.value = pageData.clothList;
                loading.value = false;
            } else {
                options.value = []
            }
        };

        //下拉框查询
        function selCxAll(val: any) {
            post({
                url: "pdm/ClothSet/getFieldValue",
                data: val
            }).then(({ data, code }: any) => {
                if (code === 200) {
                    pageData.clothList = data;
                } else {
                    Message.error({
                        content: "查询失败！",
                        duration: 5000,
                    });
                }
            });
        }

        //新增下拉
        const basicData = reactive({
            dictTypeList: ['订单性质', '计算方式', '面料销售类型', '结算公司'],
            ProductionMode: [],
            machinType: [],
            ExchangecalorieClassify: [],
            saleType: [],
            labelFormat: [],
            UrgentCategory: [],

            orderNature: [],
            Calculation: [],
            plusMaterial: [],
            corporation: [],
            custom: [],
            hrEmployee: [],
            baCompany: [],
            VerifyStandard: [],
            coloringMatch: [],
            seasonSet: []

        })

        function getOrderNature(codeType: any, dictionary: any) {
            post({
                url: "dict/dictTypeDetail/getList",
                data: {
                    codeType: codeType,
                    obsoletestate: 0,
                    deletestate: 0
                }
            }).then(({ data, code }: any) => {
                if (code === 200) {
                    switch (dictionary) {
                        case '订单性质':
                            basicData.orderNature = data
                            break;
                        case '计算方式':
                            basicData.Calculation = data
                            break;
                        case '面料销售类型':
                            basicData.plusMaterial = data
                            break;
                        case '结算公司':
                            basicData.corporation = data
                            break;
                    }
                }
            }).catch(console.log).finally(() => {
                pageData.pageLoading = false
            });
        }

        //下拉框集合方法
        function getProductionMode() {
            pageData.pageLoading = true
            //订单号
            //生产方式
            post({
                url: "/aps/planOrder/getAutomaticInfo",
            }).then(({ data, code }: any) => {
                if (code === 200) {
                    form.orderCode = data.maxOrderCode
                }
            }).catch(console.log).finally(() => {
                pageData.pageLoading = false
            });



            //生产方式
            post({
                url: "/aps/ProductionMode/getFieldValue",
                data: {
                    productionMode: ''
                }
            }).then(({ data, code }: any) => {
                if (code === 200) {
                    basicData.ProductionMode = data
                }
            }).catch(console.log).finally(() => {
                pageData.pageLoading = false
            });
            //加工类型
            post({
                url: "/aps/machinType/getDropValue",
                data: {
                    machinType: ''
                }
            }).then(({ data, code }: any) => {
                if (code === 200) {
                    basicData.machinType = data
                }
            }).catch(console.log).finally(() => {
                pageData.pageLoading = false
            });

            //流转卡归类
            post({
                url: "/aps/ExchangecalorieClassify/getDropValue",
                data: {
                    exchangeCalorieClassify: ''
                }
            }).then(({ data, code }: any) => {
                if (code === 200) {
                    basicData.ExchangecalorieClassify = data
                }
            }).catch(console.log).finally(() => {
                pageData.pageLoading = false
            });

            //销售类型
            post({
                url: "/aps/SaleType/getFieldValue",
                data: {
                    saleType: ''
                }
            }).then(({ data, code }: any) => {
                if (code === 200) {
                    basicData.saleType = data
                }
            }).catch(console.log).finally(() => {
                pageData.pageLoading = false
            });

            //标签格式
            post({
                url: "/aps/labelFormat/getDropValue",
                data: {
                    labelFormat: ''
                }
            }).then(({ data, code }: any) => {
                if (code === 200) {
                    basicData.labelFormat = data
                }
            }).catch(console.log).finally(() => {
                pageData.pageLoading = false
            });
            //加急类型
            post({
                url: "/aps/UrgentCategory/getFieldValue",
                data: {
                    urgentCategory: ''
                }
            }).then(({ data, code }: any) => {
                if (code === 200) {
                    basicData.UrgentCategory = data
                }
            }).catch(console.log).finally(() => {
                pageData.pageLoading = false
            });

            //测试标准
            post({
                url: "/pdm/VerifyStandard/getFieldValue",
                data: {
                    verifyStandard: ''
                }
            }).then(({ data, code }: any) => {
                if (code === 200) {
                    basicData.VerifyStandard = data
                }

            }).catch(console.log).finally(() => {
                pageData.pageLoading = false
            });


            //测试标准
            post({
                url: "/pdm/coloringMatch/getFieldValue",
                data: {
                    colourLight: ''
                }
            }).then(({ data, code }: any) => {
                if (code === 200) {
                    basicData.coloringMatch = data
                }

            }).catch(console.log).finally(() => {
                pageData.pageLoading = false
            });


            //季节
            post({
                url: "/pdm/seasonSet/getFieldValue",
                data: {
                    seasonName: '季节1'
                }
            }).then(({ data, code }: any) => {
                console.log(data, 'ssssssssssssssssssssssss')
                if (code === 200) {
                    basicData.seasonSet = data
                }

            }).catch(console.log).finally(() => {
                pageData.pageLoading = false
            });


            //   客订名称
            post({
                url: "/aps/custom/getDropValue",
                data: {
                    customName: ''
                }
            }).then(({ data, code }: any) => {
                if (code === 200) {
                    basicData.custom = data
                }
            }).catch(console.log).finally(() => {
                pageData.pageLoading = false
            });

            //部门管理
            post({
                url: "/org/baCompany/getDepartmentTreeByUser",
            }).then(({ data, code }: any) => {
                if (code === 200) {
                    basicData.baCompany = data
                }
            }).catch(console.log).finally(() => {
                pageData.pageLoading = false
            });

            //业务员
            post({
                url: "/org/hrEmployee/getList",
                data: {
                    departmentId: ""
                }
            }).then(({ data, code }: any) => {
                if (code === 200) {
                    basicData.hrEmployee = data
                }
            }).catch(console.log).finally(() => {
                pageData.pageLoading = false
            });




            //字典

            for (let i = 0; i < basicData.dictTypeList.length; i++) {

                post({
                    url: "dict/dictType/getList",
                    data: {
                        typeName: basicData.dictTypeList[i],
                        deleteState: 0
                    }
                }).then(({ data, code }: any) => {
                    if (code === 200) {
                        if (data[0].codeType != 'undefined') {
                            getOrderNature(data[0].codeType, basicData.dictTypeList[i])
                        }
                    }
                }).catch(console.log).finally(() => {
                    pageData.pageLoading = false
                });

            }
        }








        onMounted(() => {
            doRefresh();
        });
        //查询
        const selectHandler = () => {
            pagination.page = 1
            doRefresh();
        }
        const queryData = reactive({
            clothType: "",
        });
        const addHandler = () => {

            for (var key in dataForm) {
                if (key === "id") {
                    dataForm[key] = null;
                } else if (key == 'serialNumber') {
                    dataForm[key] = 0;
                }
                else {
                    dataForm[key] = "";
                }

            }
            pageData.showAdd = true;
            pageData.sideTitle = "新增计划订单";
            totalGetList();
            colorGetList();
            // getProductionMode();

        };


        const dataForm = reactive<ClothSet>({
            id: null,
            serialNumber: 0,
            createTime: "",
            mercery: "",
            remark: "",
            updateTime: "",
            updateName: "",
            createName: "",
            deleteState: 0
        });
        const formRef = ref<FormInstance>();
        const sideOk = () => {
            console.log(form, pageData.sideTitle)
            // formRef.value?.validate().then((err) => {

            //         if (!err) {
            if (pageData.sideTitle === "新增计划订单") {
                post({
                    url: "/aps/planOrder/insert",
                    data: form,
                }).then((res: any) => {
                    if (res.code === 200) {
                        formRef.value?.resetFields();

                        pageData.showAdd = false;

                        Message.success({
                            content: "新增成功",
                            duration: 5000,
                        });
                        doRefresh();
                    } else {
                        Message.error({
                            content: res.message,
                            duration: 5000,
                        });
                    }

                });
            } else {
                post({
                    url: "pdm/ClothSet/update",
                    data: [dataForm],
                }).then((res: any) => {
                    if (res.code === 200) {
                        formRef.value?.resetFields();
                        pageData.showAdd = false;

                        Message.success({
                            content: "修改成功",
                            duration: 5000,
                        });
                        doRefresh();
                    } else {
                        Message.error({
                            content: res.message,
                            duration: 5000,
                        });
                    }

                });
            }
            //         }
            // });
        };
        const deleteHandler = () => {
            var arr = [];
            console.log(gridOption.value.getSelectedRows(), 'sssssssssssssssssssssssssssssssssssss')
            arr = gridOption.value.getSelectedRows().map((item) => {
                console.log(item, 'sssssssssssssssssssssssssssssssssssss')
                return item.id
            })
            if (arr.length === 0) {
                Message.warning({
                    content: "请选择要删除的数据",
                    duration: 5000,
                });
                return;
            }
            Modal.confirm({
                title: "系统提示",
                content: "确认删除选中的数据?",
                onOk() {
                    post({
                        url: "aps/planOrder/delete",
                        data: arr,
                    }).then(({ code, data }: any) => {
                        if (code === 200) {
                            Message.success({
                                content: "删除成功",
                                duration: 5000,
                            });
                            // if (selectedRowKeys.value.length == tableCon.tableConter.length) {
                            //     pages.value > 1 ? pages.value-- : pages.value = 1
                            //     doRefresh();
                            // } else {
                            //     doRefresh();
                            // }
                            pages.value = 1;
                            doRefresh();
                        } else {
                            Message.error({
                                content: "删除失败",
                                duration: 5000,
                            });
                        }
                        selectedRowKeys.value = [];
                    });
                },
            });
        };


        const deleteBzyq = (record: ClothSet) => {
            for (var key in record) {
                dataForm[key] = record[key]
            }
            pageData.sideTitle = '删除'
            pageData.showAdd = true
        };


        const editHandler = (record: ClothSet) => {
            for (var key in record) {
                dataForm[key] = record[key]
            }
            pageData.sideTitle = '修改布类定义'
            pageData.showAdd = true
        };

        //审核
        const toExamine = () => {
            if (selectedRowKeys.value.length === 0) {
                return;
            }
            let trialData = []
            for (let i = 1; i <= selectedRowKeys.value.length; i++) {
                trialData.push({
                    id: selectedRowKeys.value[i - 1],
                    auditState: tableCon.tableConter[i - 1].auditState
                })
            }
            Modal.confirm({
                title: "系统提示",
                content: "确认审核选中的数据?",
                onOk() {
                    post({
                        url: "/aps/planOrder/audit",
                        data: trialData

                    }).then(({ code, data }: any) => {
                        if (code === 200) {
                            Message.success({
                                content: "审核成功",
                                duration: 5000,
                            });

                            pagination.page = 1
                            doRefresh();

                        } else {
                            Message.error({
                                content: "审核失败",
                                duration: 5000,
                            });
                        }

                    });
                },
            });
        }

        //导出
        const exports = () => {
            if (selectedRowKeys.value.length === 0) {
                Message.error('请先勾选')
                return
            } else {
                //将表头拼接出来
                let head = "<th>编号</th><th>名称</th><th>备注</th><th>创建人</th><th>创建时间</th><th>最后修改人</th><th>最后修改时间</th>"
                //拿到当前表格数据与勾选的行做筛选

                let nowRow = table.dataList.filter(function (o) {
                    return selectedRowKeys.value.indexOf(o["id"]) !== -1;
                })
                let body = "";
                nowRow.forEach(function (o) {
                    body += "<tr><td>" + o["merceryCode"] + "</td>";
                    body += "<td>" + o["merceryName"] + "</td>";
                    body += "<td>" + o["remark"] + "</td>";
                    body += "<td>" + o["createName"] + "</td>";
                    body += "<td>" + o["createTime"] + "</td>";
                    body += "<td>" + o["updateName"] + "</td>";
                    body += "<td>" + o["updateTime"] + "</td>";
                    body += "</tr>";
                })
                tableToXlsx(head, '布类资料', body)
                console.log(table)
            }
        }

        const exCustomer = () => {
            pageData.showAdd = false
            pageData.importAdd = true
            //季节
            downloadHandler('/api/aps/orderCustom/uploadOrderCustomeModel')

        }

        function tableToXlsx(head: any, filename: any, body: any) {
            const uri = 'data:application/vnd.ms-excel;base64,',
                template = `<html>
          <head><meta charset="UTF-8"></head>
          <body><table border="1"><tr>${head}</tr>${body}</table></body>
      </html>`;

            const a = document.createElement('a');
            a.href = uri + window.btoa(unescape(encodeURIComponent(template)));
            a.download = filename;
            a.click();
            document.removeChild(a);
        }



        //模板下载
        const downloadHandler = (baseURL: any) => {
            axios.get(baseURL, {
                responseType: 'blob',
                headers: {
                    token: sessionStorage.getItem('USER-TOKEN-KEY')
                }
            }).then((res) => {
                if (res.status === 200) {
                    filedownload(res.data, '巨客户模板.xlsx')
                }
            })
        }
        //导入
        const orderCustomList = reactive({
            list: []
        })
        const importHandler = () => {

            const inputEle: HTMLInputElement = document.createElement('input')
            inputEle.type = 'file'
            inputEle.id = 'fileUploadExcel'
            inputEle.accept = 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel'
            inputEle.addEventListener('change', (e) => {
                const formData = new FormData()
                if (inputEle.files !== null) {
                    formData.append('file', inputEle.files[0] || '')
                } else {
                    Message.warning('未选择文件！');
                    return
                }
                pageData.pageLoading = true
                axios.post('/api/aps/orderCustom/analyseOrderCustomeModel', formData, {
                    headers: {
                        "Content-Type": 'multipart/form-data',
                        "token": sessionStorage.getItem('USER-TOKEN-KEY')
                    },
                }).then((result) => {
                    if (result.data['code'] === 200) {
                        Message.success('导入成功')
                    } else {
                        Message.error(result.data.message)
                    }

                }).finally(() => {
                    // pageData.pageLoading = false
                    // doRefresh()
                    post({
                        url: "/aps/orderCustom/getList",
                    }).then(({ data, code }: any) => {
                        if (code === 200) {
                            orderCustomList.list = data
                        }
                    }).catch(console.log).finally(() => {
                        pageData.pageLoading = false
                    });
                })
            })
            inputEle.click()
        }
        return {
            alone,
            alonell,
            scroll,
            scrollbar,
            tablediv,
            downloadHandler,
            importHandler,
            hasChiese,
            deleteHandler,
            sideOk,
            formRef,
            dataForm,
            addHandler,
            selectedRowKeys,
            pagination,
            // tableColumns,
            table,
            columns,
            data,
            rowKey,
            pageData,
            queryData,
            editHandler,
            selectHandler,
            options,
            loading,
            handleSearch,
            exports,
            focusSel,
            headerShow,
            form,
            total,
            optionsorder,
            columnsOrder,
            dataOrder,
            tableCon,
            toExamine,
            exCustomer,
            hugeCustomer,
            colorCar,
            totaInfolList,
            totalGetList,
            colorCarList,
            colorGetList,
            hugeCustomerList,
            hugeCustomerGetList,
            defaultColDef,
            rowData,
            columnDefs,
            tc,
            gridOption,
            gridReady,
            ta,
            tcy,
            InformationEnglishbt,
            defaultColDefy,
            gridOptiony,
            gridReadye,
            bzyqAdd,
            planorderCast,
            tco,
            planorderCastDefy,
            tcoChx,
            deleteBzyq,
            basicData,
            getProductionMode,
            getOrderNature,
            orderCustomList,
            fromList,
            Search, CirclePlus, Delete

        };
    },
    components: {
        Toolbar,
        
    },
};
</script>
<style lang="less">
.a {
    color: blur;
}

.tjan {
    padding: 0 10px 6px 10px;
    display: flex;
    justify-content: flex-end;
}

.shruq-but {
    width: 90px;
    height: 30px;
    color: #165dff;
    background-color: #e8f7ff;
    border-radius: 5px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 6px;
    cursor: pointer;
}


.pagings {
    margin-top: 10px;
    display: flex;
    justify-content: flex-end;
}

.pagings {
    margin-top: 10px;
    display: flex;
    justify-content: center;
}

.arco-input-wrapper {
    background-color: #fff !important;
    border: 1px solid #cccccc;
}

.arco-form-item-status-error .arco-input-wrapper:not(.arco-input-disabled),
.arco-form-item-status-error .arco-textarea-wrapper:not(.arco-textarea-disabled) {
    border: 1px solid #f53f3f;
}

/********************************************** */
.stbutencx {
    background-color: #409eff;

    &:hover {
        background-color: #79bbff;
    }
}

.ag-header-cell-resize::after {
    top: 0 !important;
    height: 100% !important;
}

.ag-cell {
    border-right: 1px solid #D9DDDF !important;
}

.stbutenxz {
    background-color: #67c23a;

    &:hover {
        background-color: #b3e19d;
    }
}
</style>